<template>
  <div class="viphallData">
    <!-- 顶部 -->
    <div style="margin: 10px">
      <h4>vip通道基础数据</h4>
    </div>
    <!-- 查询条件 -->
    <div class="middle">
      <el-form :model="selectData" size="mini" :inline="true">
        <el-form-item label="所属分类" prop="name">
          <el-select clearable v-model="selectData.ofType" placeholder="请选择">
            <el-option
              v-for="item in ofTypeList"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item
          size="mini"
          label="所属城市"
          v-if="
            selectData.ofType == 'domesticAirport' ||
            selectData.ofType == 'internationalAirport'
          "
        >
          <el-select
            v-model="selectData.ofCityCode"
            filterable
            clearable
            placeholder="请选择"
          >
            <el-option
              v-for="(item, index) in cityFlightList"
              :key="index"
              :label="item.airportCityName"
              :value="item.airportCityId"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item
          size="mini"
          label="所属城市"
          v-if="
            selectData.ofType == 'highstation' ||
            selectData.ofType == 'trainstation'
          "
        >
          <el-select
            v-model="selectData.ofCityCode"
            filterable
            clearable
            placeholder="请选择"
          >
            <el-option
              v-for="(item, index) in cityTrainList"
              :key="index"
              :label="item.cityName"
              :value="item.cityCode"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item size="mini" label="通道名称">
          <el-input v-model="selectData.channelName" size="mini"></el-input>
        </el-form-item>

        <el-form-item size="mini" label="状态">
          <el-select
            clearable
            v-model="selectData.channelStatus"
            placeholder="请选择"
          >
            <el-option
              v-for="item in statusList"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </el-form-item>

        <el-form-item>
          <el-button type="primary" @click="getselectVipchanne()"
            >查询</el-button
          >
          <el-button @click="centerDialogadd" type="primary">新增</el-button>
        </el-form-item>
      </el-form>
    </div>
    <!-- 订单列表 -->
    <div class="table">
      <el-table
        size="mini"
        :header-cell-style="{
          color: '#fff',
          background: '#6090EC',
          fontSize: '11px',
          fontWeight: 'normal',
        }"
        :data="selecttabel"
        border
        style="width: 100%"
      >
        <el-table-column prop="channelName" label="名称"> </el-table-column>
        <el-table-column prop="ofCityName" label="所属城市"> </el-table-column>
        <el-table-column prop="ofType" label="贵宾厅分类">
          <template slot-scope="scope">
            <template v-if="scope.row.ofType == 'domesticAirport'"
              >国内机场</template
            >
            <template v-if="scope.row.ofType == 'internationalAirport'"
              >国际机场</template
            >
            <template v-if="scope.row.ofType == 'highstation'">高铁</template>
            <template v-if="scope.row.ofType == 'trainstation'"
              >火车站</template
            >
            <template v-if="scope.row.ofType == 'harbor'">港口</template>
          </template>
        </el-table-column>
        <el-table-column prop="ofPlaceName" label="所属机场/高铁">
        </el-table-column>
        <el-table-column prop="ofTerminalName" label="航站楼">
        </el-table-column>
        <el-table-column
          prop="businessStartTime,businessEndTime"
          label="营业时间"
        >
          <template slot-scope="scope">
            {{ scope.row.businessStartTime }}- {{ scope.row.businessEndTime }}
          </template>
        </el-table-column>
        <!-- <el-table-column prop="loungePhone" label="贵宾厅电话">
        </el-table-column> -->
        <el-table-column prop="managerName" label="服务负责人">
        </el-table-column>
        <el-table-column prop="managerPhone" label="负责人电话">
        </el-table-column>
        <el-table-column prop="channelStatus" label="状态">
          <template slot-scope="scope">
            <template v-if="scope.row.channelStatus == 'yes'">启用</template>
            <template v-if="scope.row.channelStatus == 'no'">未启用</template>
            <template v-if="scope.row.channelStatus == 'del'">删除</template>
          </template>
        </el-table-column>
        <el-table-column width="220px" label="操作">
          <template slot-scope="scope">
            <el-button
              size="mini"
              type="primary"
              @click="editviphallmethod(scope.row)"
              >修改</el-button
            >
            <el-button
              size="mini"
              type="primary"
              @click="delviphallmethod(scope.row)"
              >删除</el-button
            >
          </template>
        </el-table-column>
      </el-table>
    </div>
    <!-- 新增弹窗 -->
    <el-dialog
      title="vip通道"
      :visible.sync="centerDialogVisible"
      :close-on-click-modal="false"
      width="90%"
      center
    >
      <!-- 基本信息 -->
      <div class="jbxx">
        <div class="lump-top">基本信息</div>
        <div class="lump-bottom" style="border-bottom: 0.5px solid #4490ae">
          <div class="lump-bottom-small">所属分类</div>
          <div class="lump-bottom-big" style="display: flex">
            <el-select
              v-model="adddata.ofType"
              clearable
              size="mini"
              style="width: 130px; height: 30px"
              filterable
            >
              <el-option
                v-for="(item, index) in ofTypeList"
                :key="index"
                :label="item.label"
                :value="item.value"
              >
              </el-option>
            </el-select>
          </div>
          <div class="lump-bottom-small">所属城市</div>
          <div class="lump-bottom-big" style="display: flex">
            <el-select
              @change="cityFlightChange"
              v-model="adddata.ofCityCode"
              v-if="
                adddata.ofType == 'domesticAirport' ||
                adddata.ofType == 'internationalAirport'
              "
              clearable
              size="mini"
              style="width: 130px; height: 30px"
              filterable
              placeholder="请选择城市"
            >
              <el-option
                v-for="(item, index) in cityFlightList"
                :key="index"
                :label="item.airportCityName"
                :value="item.airportCityId"
              >
              </el-option>
            </el-select>
            <el-select
              @change="cityTrainChange"
              v-model="adddata.ofCityIdtihuan"
              v-if="
                (cityTrainList.length && adddata.ofType == 'highstation') ||
                adddata.ofType == 'trainstation'
              "
              clearable
              size="mini"
              style="width: 130px; height: 30px"
              filterable
              placeholder="请选择城市"
            >
              <el-option
                v-for="(item, index) in cityTrainList"
                :key="index"
                :label="item.cityName"
                :value="item.cityCode"
              >
              </el-option>
            </el-select>
          </div>
          <div class="lump-bottom-small">所属机场/车站</div>
          <div class="lump-bottom-big">
            <el-select
              @change="ofPlaceIdChange"
              v-model="adddata.ofPlaceCode"
              v-if="
                adddata.ofType == 'domesticAirport' ||
                adddata.ofType == 'internationalAirport'
              "
              size="mini"
              filterable
              placeholder="请选择机场"
              clearable
            >
              <el-option
                v-for="(item, index) in airportList"
                :key="index"
                :label="item.airportName"
                :value="item.airportId"
              >
              </el-option>
            </el-select>
            <!-- <el-select @change="ofPlaceIdTrainChange" v-model="adddata.ofPlaceIdtihuan" v-if="adddata.ofType =='highstation'||adddata.ofType =='trainstation'" size="mini" filterable placeholder="请选择机场" clearable>
              <el-option v-for="(item,index) in trainList" :key="index" :label="item.airportName"
                :value="item.airportId +'-'+ airportName">
              </el-option>
            </el-select> -->
          </div>
          <div class="lump-bottom-small">航站楼</div>
          <div class="lump-bottom-big">
            <el-select
              v-model="adddata.ofTerminalId"
              size="mini"
              filterable
              placeholder="请选择航站楼"
              clearable
            >
              <el-option
                v-for="item in Terminallist"
                :key="item.terminalId"
                :label="item.terminalName"
                :value="item.id"
              >
              </el-option>
            </el-select>
          </div>
        </div>
        <div class="lump-bottom">
          <div class="lump-bottom-small">选择供应商</div>
          <div class="lump-bottom-big" style="display: flex">
            <el-select
              v-model="adddata.deptId"
              size="mini"
              style="width: 130px; height: 30px"
              filterable
              placeholder="请选择部门"
              clearable
              @change="deptIdchange"
            >
              <el-option
                v-for="(item, index) in departmentList"
                :key="index"
                :label="item.deptName"
                :value="item.deptId"
              >
              </el-option>
            </el-select>
            <el-select
              v-model="adddata.deptAdminId"
              size="mini"
              style="width: 130px; height: 30px"
              filterable
              placeholder="请选择员工"
              clearable
            >
              <el-option
                v-for="(item, index) in postslists"
                :key="index"
                :label="item.adminName"
                :value="item.id"
              >
              </el-option>
            </el-select>
          </div>
        </div>
      </div>

      <!-- 贵宾厅信息 -->
      <div class="jbxx">
        <div class="lump-top">快速通道信息</div>
        <div class="lump-bottom">
          <div class="lump-bottom-small">通道名称</div>
          <div class="lump-bottom-big-1" style="display: flex; width: 100%">
            <el-input
              v-model="adddata.channelName"
              size="mini"
              placeholder="请输入内容"
            ></el-input>
          </div>
        </div>
        <div class="lump-bottom">
          <div class="lump-bottom-small">服务负责人</div>
          <div class="lump-bottom-big-1" style="display: flex">
            <el-input
              v-model="adddata.managerName"
              size="mini"
              placeholder="请输入内容"
            ></el-input>
          </div>
          <div class="lump-bottom-small">负责人电话</div>
          <div class="lump-bottom-big-1">
            <el-input
              v-model="adddata.managerPhone"
              size="mini"
              placeholder="请输入内容"
            ></el-input>
          </div>
          <div class="lump-bottom-small">营业时间</div>
          <div class="lump-bottom-big-1">
            <el-time-picker
              style="width: 45%"
              size="mini"
              format="HH:mm"
              value-format="HH:mm"
              v-model="adddata.businessStartTime"
           
              placeholder="任意时间点"
            >
            </el-time-picker
            >--
            <el-time-picker
              style="width: 45%"
              size="mini"
              format="HH:mm"
              value-format="HH:mm"
              v-model="adddata.businessEndTime"
            
              placeholder="任意时间点"
            >
            </el-time-picker>
          </div>
          <div class="lump-bottom-small">地址</div>
          <div class="lump-bottom-big-1">
            <el-input
              v-model="adddata.channelAddress"
              size="mini"
              placeholder="请输入内容"
            ></el-input>
          </div>
        </div>
        <div class="lump-bottom">
          <div class="lump-bottom-small">状态</div>
          <div class="lump-bottom-big-1">
            <el-radio-group v-model="adddata.channelStatus">
              <el-radio label="no">禁用</el-radio>
              <el-radio label="yes">启用</el-radio>
            </el-radio-group>
          </div>
        </div>
        <!-- <div class="lump-bottom-small" style="height: 50px; line-height: 50px">
            所属分类
          </div>
          <div class="lump-bottom-big-1" style="display: flex; height: 50px">
            <el-radio-group v-model="adddata.vipchannelLocationTypeId" style="margin-top: 10px">
              <el-radio :label="1">国内机场</el-radio>
              <el-radio :label="2">高铁</el-radio>
              <el-radio :label="3">国际机场</el-radio>
              <el-radio :label="4">火车站</el-radio>
              <el-radio :label="5">港口</el-radio>
            </el-radio-group>
          </div> -->

        <!-- <div class="lump-bottom" style="height: 50px">
          <div class="lump-bottom-small" style="height: 50px; line-height: 50px">
            是否含通道
          </div>
          <div class="lump-bottom-big-1" style="display: flex; height: 50px; line-height: 50px">
            <el-radio v-model="addviphallchanl.includeVIPHall" label="true">是</el-radio>
            <el-radio v-model="addviphallchanl.includeVIPHall" label="false">否</el-radio>
          </div>
        </div> -->
      </div>
      <!-- 价格信息 -->
      <div class="jbxx">
        <div class="lump-top">价格信息</div>
        <div class="lump-bottom">
          <div class="lump-bottom-small">采购价</div>
          <div class="lump-bottom-big" style="display: flex">
            <el-input size="mini" v-model="adddata.purchasePrice"></el-input>
          </div>
          <div class="lump-bottom-small">市场价</div>
          <div class="lump-bottom-big" style="display: flex">
            <el-input size="mini" v-model="adddata.marketPrice"></el-input>
          </div>
          <div class="lump-bottom-small">销售价</div>
          <div class="lump-bottom-big" style="display: flex">
            <el-input size="mini" v-model="adddata.sellingPrice"></el-input>
          </div>
          <div class="lump-bottom-small">评分</div>
          <div class="lump-bottom-big" style="display: flex">
            <el-input
              size="mini"
              type="number"
              max="5"
              v-model="adddata.channelScore"
            ></el-input>
          </div>
        </div>
      </div>
      <!-- 会员/亲朋价维护 -->
      <div class="jbxx">
        <div class="lump-top">会员/亲朋价维护</div>
        <div class="lump-bottom">
          <el-input
            style="width: 100px"
            size="mini"
            v-model="adddata.memberPrice"
          ></el-input>
        </div>
      </div>
      <!--  积分兑换价维护 -->
      <div class="jbxx">
        <div class="lump-top">积分兑换价维护</div>
        <div class="lump-bottom">
          <el-input
            style="width: 100px"
            size="mini"
            v-model="adddata.integralPrice"
          ></el-input>
        </div>
      </div>
       <!-- 图片 -->
      <div class="jbxx">
        <div class="lump-top">图片</div>
        <div class="lump-bottom">
           <el-upload
                class="avatar-uploader"
                :action="imgHttpUrl"
                :show-file-list="false"
                :on-success="handleAvatarSuccess"
                list-type="picture-card"
                :on-exceed="handleExceed"
                 :headers="header"
                :data="multipartFile"
              >
                
              <!-- :before-upload="beforeAvatarUpload" -->
                <img v-if="imageUrl" :src="imageUrl"  class="avatar" />
                <i v-else class="el-icon-plus"></i>
           </el-upload>
        </div>
      </div>
      <!-- 操作日志 -->
      <div class="jbxx">
        <div class="lump-top">备注</div>
        <div class="lump-bottom">
          <el-input
            style="width: 100%"
            type="textarea"
            autosize
            placeholder="请输入内容"
            v-model="adddata.channelRemark"
          >
          </el-input>
        </div>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="centerDialogVisible = false">取 消</el-button>
        <el-button type="primary" @click="gocreate()">确 定</el-button>
      </span>
    </el-dialog>
    <!-- 删除弹窗 -->

    <el-dialog
      title="删除"
      :visible.sync="delDialogVisible"
      :close-on-click-modal="false"
      width="30%"
      center
    >
      <span>确认删除此vip通道基础数据吗</span>
      <span slot="footer" class="dialog-footer">
        <el-button @click="delDialogVisible = false">取 消</el-button>
        <el-button type="primary" @click="getdelVipchannel()">确 定</el-button>
      </span>
    </el-dialog>

    <el-pagination
      @size-change="handleSizeChange"
      @current-change="handleCurrentChange"
      :page-sizes="[10, 15, 20]"
      layout="total, sizes, prev, pager, next, jumper"
      :total="pageTotal"
    >
    </el-pagination>
  </div>
</template>

<script>
export default {
  name: "viphallChannelData",
  data() {
    return {
      baseURL:localStorage.getItem('baseUrl'),
  multipartFile:{type: "ciphalllChanne"},
      header:{
         token:localStorage.getItem('Xd_Token'),
      },
      imageUrl:"",
      updateimageUrl:"",
imgHttpUrl:this.$imgHttpUrl,

      selecttabel: [],
      Terminallist: [],
      departmentList: [],
      postslists: [],
      // 分页信息
      pageTotal: 0,
      // 所属分类

      ofTypeList: [
        {
          value: "domesticAirport",
          label: "国内机场",
        },
        {
          value: "internationalAirport",
          label: "国际机场",
        },
        {
          value: "highstation",
          label: "高铁站",
        },

        {
          value: "trainstation",
          label: "火车站",
        },
        {
          value: "harbor",
          label: "港口",
        },
      ],

      // 火车城市
      cityTrainList: [],
      // 飞机城市
      cityFlightList: [],
      airportList: [],
      // 查询数据
      selectData: {
        ofType: "",
        ofCityCode: "",
        channelName: "",
        channelStatus: "",
        pageSize: "10",
        pageNo: "1",
      },
      // 新增数据
      adddata: {
        id: "",
        ofType: "",
        ofCityId: "",
        ofCityName: "",
        ofCityCode: "",
        ofPlaceId: "",
        ofPlaceName: "",
        ofPlaceCode: "",
        ofTerminalId: "",
        ofTerminalName: "",
        deptId: "",
        deptAdminId: "",
        channelName: "",
        channelAddress: "",
        managerName: "",
        managerPhone: "",
        loungePhone: "",
        loungeCalss: "",
        businessStartTime: "",
        businessEndTime: "",
        channelStatus: "",
        purchasePrice: "",
        marketPrice: "",
        sellingPrice: "",
        memberPrice: "",
        integralPrice: "",
        channelRemark: "",
      },

      //新增弹出框
      centerDialogVisible: false,
      delDialogVisible: false,
      // 状态下拉
      statusList: [
        {
          value: "yes",
          label: "启用",
        },
        {
          value: "no",
          label: "未启用",
        },
        {
          value: "del",
          label: "删除",
        },
      ],
    };
  },
  watch: {},
  methods: {
    // 飞机城市
    getqueryFlightCityByName() {
      this.$axios.getqueryFlightCityByName({}).then((res) => {
        if (res.code == "00000") {
          this.cityFlightList = res.data;
        }
      });
    },
    // 火车城市
    getqueryTrainCityByName() {
      this.$axios.getqueryTrainCityByName({}).then((res) => {
        if (res.code == "00000") {
          this.cityTrainList = res.data;
          console.log(this.cityTrainList);
        }
      });
    },
    // 城市的change事件
    cityFlightChange(val) {
      this.adddata.ofCityCode = val;
      console.log(this.adddata.ofCityName);
      this.$axios
        .queryAirportByCityCode({
          cityCode: val,
        })
        .then((res) => {
          if (res.code == "00000") {
            this.airportList = res.data;
          }
        });
    },
    cityTrainChange(val) {
      this.$axios
        .queryStationByCityCode({
          cityCode: val,
        })
        .then((res) => {
          if (res.code == "00000") {
            this.trainList = res.data;
          }
        });
    },
    // 城市Change
    ofPlaceIdChange(val) {
      console.log(val);
      this.$axios
        .queryTerminalByAirportCode({
          airportCode: val,
        })
        .then((res) => {
          if (res.code == "00000") {
            this.Terminallist = res.data;
          }
        });
    },

    // 火车城市change
    ofPlaceIdTrainChange(val) {
      console.log(val);
    },

    // 部门
    getDeptListAll() {
      this.$axios.getDeptListAll({}).then((res) => {
        console.log(res);
        if (res.code == "00000") {
          this.departmentList = res.data;
          console.log(this.departmentList);
        }
      });
    },

    // 部门change事件
    deptIdchange(val) {
      this.$axios
        .getAdminByDept({
          deptId: val,
        })
        .then((res) => {
          console.log(res);
          if (res.code == "00000") {
            this.postslists = res.data;
          }
        });
    },

    // 新增按钮
    centerDialogadd() {
      this.adddata = {};
      this.adddata.id = "";
      this.imageUrl = "";
      this.updateimageUrl = "";

      this.centerDialogVisible = true;
       
    },
    gocreate() {
      if (this.adddata.id == "") {
        this.getaddVipchannel();
      } else {
        this.geteidtVipchannel();
      }
    },

    // 新增VIP通道基础数据
    getaddVipchannel() {
      this.$axios
        .getaddVipchannel({
          ofType: this.adddata.ofType,
          ofCityId: this.adddata.ofCityId,
          ofCityName: this.adddata.ofCityName,
          ofCityCode: this.adddata.ofCityCode,
          ofPlaceId: this.adddata.ofPlaceId,
          ofPlaceName: this.adddata.ofPlaceName,
          ofPlaceCode: this.adddata.ofPlaceCode,
          ofTerminalId: this.adddata.ofTerminalId,
          ofTerminalName: this.adddata.ofTerminalName,
          deptId: this.adddata.deptId,
          deptAdminId: this.adddata.deptAdminId,
          channelName: this.adddata.channelName,
          channelAddress: this.adddata.channelAddress,
          channelScore: this.adddata.channelScore,
          managerName: this.adddata.managerName,
          managerPhone: this.adddata.managerPhone,
          businessStartTime: this.adddata.businessStartTime,
          businessEndTime: this.adddata.businessEndTime,
          channelStatus: this.adddata.channelStatus,
          purchasePrice: this.adddata.purchasePrice,
          marketPrice: this.adddata.marketPrice,
          sellingPrice: this.adddata.sellingPrice,
          memberPrice: this.adddata.memberPrice,
          integralPrice: this.adddata.integralPrice,
          channelRemark: this.adddata.channelRemark,
          channelBackground:this.updateimageUrl

        })
        .then((res) => {
          console.log(res);
          if (res.code == "00000") {
            this.getselectVipchannelList();
            (this.centerDialogVisible = false),
              this.$message({
                message: "新增成功",
                type: "success",
              });
          }
        });
    },
    //修改点击事件
    editviphallmethod(row) {
      console.log(row);
      this.adddata.id = row.id;
      this.$axios
        .getVipChannelInfo({
          id: row.id,
        })
        .then((res) => {
          console.log(res);
          if (res.code == "00000") {
            this.adddata = res.data;
                 this.imageUrl =this.baseURL + res.data.channelBackground;
                 this.updateimageUrl = res.data.channelBackground;
            this.cityFlightChange(res.data.ofCityCode);
            this.ofPlaceIdChange(res.data.ofPlaceCode);
            this.deptIdchange(res.data.deptId);
            this.centerDialogVisible = !this.centerDialogVisibl;
          }
        });
    },

    // 修改VIP通道基础数据
    geteidtVipchannel() {
      this.$axios
        .geteidtVipchannel({
          id: this.adddata.id,
          ofType: this.adddata.ofType,
          ofCityId: this.adddata.ofCityId,
          ofCityName: this.adddata.ofCityName,
          ofCityCode: this.adddata.ofCityCode,
          ofPlaceId: this.adddata.ofPlaceId,
          ofPlaceName: this.adddata.ofPlaceName,
          ofPlaceCode: this.adddata.ofPlaceCode,
          ofTerminalId: this.adddata.ofTerminalId,
          ofTerminalName: this.adddata.ofTerminalName,
          deptId: this.adddata.deptId,
          deptAdminId: this.adddata.deptAdminId,
          channelName: this.adddata.channelName,
          channelAddress: this.adddata.channelAddress,
          channelScore: this.adddata.channelScore,
          managerName: this.adddata.managerName,
          managerPhone: this.adddata.managerPhone,
          businessStartTime: this.adddata.businessStartTime,
          businessEndTime: this.adddata.businessEndTime,
          channelStatus: this.adddata.channelStatus,
          purchasePrice: this.adddata.purchasePrice,
          marketPrice: this.adddata.marketPrice,
          sellingPrice: this.adddata.sellingPrice,
          memberPrice: this.adddata.memberPrice,
          integralPrice: this.adddata.integralPrice,
          channelRemark: this.adddata.channelRemark,
          channelBackground:this.updateimageUrl
        })
        .then((res) => {
          console.log(res);
          if (res.code == "00000") {
            this.getselectVipchannelList();
            (this.centerDialogVisible = false),
              this.$message({
                message: "修改成功",
                type: "success",
              });
          }
        });
    },

    //删除点击事件
    delviphallmethod(row) {
      this.adddata.id = row.id;
      this.delDialogVisible = !this.delDialogVisible;
    },
    //删除接口
    getdelVipchannel() {
      this.$axios
        .getdelVipchannel({
          id: this.adddata.id,
        })
        .then((res) => {
          console.log(res);
          if (res.code == "00000") {
            this.delDialogVisible = !this.delDialogVisible;
            this.getselectVipchannelList();
            this.$message({
              message: "删除成功",
              type: "success",
            });
          }
        });
    },

    //城市列表
    getselectCityList() {
      this.$axios.getselectCityList({}).then((res) => {
        console.log(res);
        if (res.code == "200") {
          let list = JSON.parse(JSON.stringify(res.data));
          this.cityList = list.map((item) => {
            return {
              label: item.cityName,
              value: item.cityCode,
            };
          });
          // this.cityList = res.data;
        }
      });
    },

    //查询列表
    getselectVipchanne() {
      this.selectData.pageSize = "10";
      this.selectData.pageNo = "1";
      this.getselectVipchannelList();
    },
    //分页
    handleSizeChange(value) {
      this.selectData.pageSize = value;
      this.getselectVipchannelList();
    },
    handleCurrentChange(value) {
      this.selectData.pageNo = value;
      this.getselectVipchannelList();
    },
    getselectVipchannelList() {
      this.$axios
        .getVipChannelList({
          ofType: this.selectData.ofType,
          ofCityCode: this.selectData.ofCityCode,
          channelName: this.selectData.channelName,
          channelStatus: this.selectData.channelStatus,
          pageSize: this.selectData.pageSize,
          pageNo: this.selectData.pageNo,
        })
        .then((res) => {
          console.log(res);
          if (res.code == "00000") {
            this.selecttabel = res.data.records;
            this.pageTotal = res.data.total;
          }
        });
    },
    handleAvatarSuccess(res, file) {
      this.imageUrl =this.baseURL + res.data[0];
      this.updateimageUrl = res.data[0]
      console.log(res, file, this.imageUrl);
    },
    
    handleExceed(files, fileList) {
      this.$message.warning(`当前限制选择 1 个文件`);
    },
  },
  mounted() {
    this.getqueryFlightCityByName();
    this.getqueryTrainCityByName();
    // 查询列表
    this.getselectVipchannelList();
    // 部门
    this.getDeptListAll();
  },
};
</script>

<style scoped>
.middle {
  display: flex;
  margin-top: 20px;
  margin-left: 10px;
}

.table {
  margin-left: 20px;
}

.caseClaim {
  font-size: 14px;
  font-weight: 400px;
}

.jbxx {
  border: 0.5px solid #4490ae;
  margin: 10px;
}

.lump-top {
  width: 100%;
  height: 30px;
  line-height: 30px;
  border-right: 0.5px solid #4490ae;
  border-bottom: 0.5px solid #4490ae;
  background: #e8f3f7;
  font-weight: 600;
  padding-left: 5px;
}

.lump-bottom {
  display: flex;
}

.lump-bottom-small {
  padding-left: 5px;
  width: 12%;
  height: 30px;
  line-height: 30px;
  background: #e8f3f7;
  border-right: 0.5px solid #4490ae;
  border-left: 0.5px solid #4490ae;
  border-bottom: 0.5px solid #4490ae;
}
.lump-bottom-big {
  width: 250px;
  height: 30px;
  line-height: 30px;
}

.lump-bottom-big-1 {
  border-bottom: 0.5px solid #4490ae;

  width: 400px;
}
 
  .avatar-uploader .el-upload {
  border: 1px dashed #d9d9d9;
  border-radius: 50%;
  cursor: pointer;
  position: relative;
  overflow: hidden;
}
.avatar-uploader .el-upload {
  border: 1px dashed #d9d9d9;
  border-radius: 6px;
  cursor: pointer;
  position: relative;
  overflow: hidden;
}
.avatar-uploader .el-upload:hover {
  border-color: #409eff;
}
.avatar-uploader-icon {
  font-size: 28px;
  color: #8c939d;
  width: 178px;
  height: 178px;
  line-height: 178px;
  text-align: center;
}
.avatar {
  width: 148px;
  height: 148px;
  display: block;
}
</style>